<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li></li>
    </ul>
    <script src="./js/axios.min.js"></script>
    <script>
        const p1=axios({url:'http://hmajax.itheima.net/api/weather',params:{city:110100}})
         const p2=axios({url:'http://hmajax.itheima.net/api/weather',params:{city:310100}})
          const p3=axios({url:'http://hmajax.itheima.net/api/weather',params:{city:440100}})
           const p4=axios({url:'http://hmajax.itheima.net/api/weather',params:{city:440300}})
        Promise.all([p1,p2,p3,p4])
        .then(res=>{
            console.log(res);
            document.querySelector('ul').innerHTML=res.map(item=>
               `<li>${item.data.data.area}-${ item.data.data.weather}</li>`).join('')
        })
        .catch(err=>{
            console.log(err.response);
          
        })
    </script>
</body>
</html>